<template>
	<div class="tab-bar-item" :class="{actived:isActived}" @click="clickChange">
		<slot v-if="!isActived" name="img"></slot>
		<slot v-else name="active-img"></slot>
		<slot name="text"></slot>
	</div>
</template>

<script>
	export default {
		name: "tab-bar-item",
		props: ['path'],

		computed: {
			isActived() {
			 return	this.$route.path.indexOf(this.path)!==-1
				//return this.$route.path == this.path
			}
		},
		methods: {
			clickChange() {
				this.$router.push(this.path)
				console.log(this.path);
			}
		}
	}
</script>

<style scoped>

</style>
